<!doctype html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<link href="css/mui.min.css" rel="stylesheet" />
		<link rel="stylesheet" href="layui/css/layui.css" />
		
		<script type="text/javascript" src="layui/layui.js" ></script>
		
		<script type="text/javascript" src="js/publicurl.js" ></script>
		<script src="js/mui.min.js"></script>
		<script src="js/jquery-3.1.1.min.js"></script>
		<script type="text/javascript" src="js/my.js" ></script>
		<script type="text/javascript" src="js/jquery-form.js" ></script>
		<style>
			#repairform{
				width: 70%;
				margin: 0 auto;
				padding-top: 10px;
			}
			#repairform input{
				width: 70%;
				
			}
			#repairform textarea{
				width:70%;
				height: 75px;
				display: inline-block;
				float: left;
			}
			#repairform p{
				width: 95%;
				
				margin-bottom: -8px;
			}
			#repairform span{
				display: inline-block;
				width:65px;
				text-align: right;
				margin-right: 5px;
				float: left;
				padding-top:8px;
			}
			font{
				color:red;
			}
		</style>
	</head>

	<body>
		<header class="mui-bar mui-bar-nav top-header" style="line-height: 35px;">
		    <a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
		    <h1 class="mui-title">报修申请</h1>
		</header>
		<div class="mui-content">
			<div id="repairform">
				<form id="repairForm" class="layui-form" action="">
					<p>
				   		<span>姓名 <font>*</font></span><input type="text" class="layui-input" lay-verify="required" placeholder="报修人姓名" name="repairName"/>
					</p>
					<p>
				   		<span>详细地址<font>*</font></span><input type="text" lay-verify="required" class="layui-input" placeholder="小区/楼栋/房间号" name="repairAddr" />
					</p>
					<p>
				   		<span>业主电话<font>*</font></span><input type="text" placeholder="报修电话" lay-verify="phone" class="layui-input" name="repairPhone"/>
					</p>
					<p>
						<span>损坏物品<font>*</font></span>
						<input type="text" name="repairTitle" class="layui-input" lay-verify="required" />
					</p>
					<p>
				   		<span>损坏描述<font>*</font></span><!--<input type="text" placeholder="损坏描述" />-->
				   		
				   		<textarea placeholder="损坏描述" lay-verify="required"  class="layui-input" name="repairDesc"></textarea>
					</p>
					<p style="text-align: right;padding-right: 5px;">
						<button class="layui-btn" lay-submit lay-filter="repairdemo">
							提交
						</button>
					</p>
			    </form>
			</div>
		</div>
		
		<script type="text/javascript">
			var userId = JSON.parse(localStorage.getItem("userInfo"));
			mui.init({
				swipeBack:true//启用右滑关闭功能
			});
			
			layui.use(['form','layer'],function() {
				var layer = layui.layer;
				var form = layui.form;
				$("#repairForm").attr("action",puburl.url+"/dangxia/user/addRepairapply");
				
				
				form.on('submit(repairdemo)',function(obj) {
					$.post(puburl.url+"/dangxia/user/addRepairapply",
						{
							"repairName":obj.field.repairName,
							"repairAddr":obj.field.repairAddr,
							"repairPhone":obj.field.repairPhone,
							"repairTitle":obj.field.repairTitle,
							"repairDesc":obj.field.repairDesc,
							"userId":userId
						},
						function(data) {
							if(data.code==0) {
								layer.msg("<span style='color:green'>"+data.msg+"</span>",{
									time:800,
									icon:1,
									end:function(){
										$("#repairForm")[0].reset();
										form.render();
									}
									
								});
								my.jump("index.html","repairapply");
							} else {
								layer.msg("<span style='color:red'>"+data.msg+"</span>",{
									time:800,
									icon:5
							});
						}
					}
				);
				return false;
			});
			});
		</script>
	</body>

</html>